<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>其他结构选择器-表单相关</title>

    <style type="text/css">
        /*!*E:enabled 匹配表单中被激活的元素*!*/
        /*input:enabled{*/
        /*    background-color: tomato;*/
        /*}*/

        /*!*E:disabled 匹配表单中未被激活的元素*!*/
        /*input:disabled{*/
        /*    background-color: red;*/
        /*}*/

        /*!*E:checked 匹配表单中被选中的radio 或者 checkbox元素*!*/
        /*input:checked{*/
        /*    width: 100px;*/
        /*    height: 100px;*/
        /*}*/

        /*!*选中input标签中被选中的 radio类型的input标签 以及对应的标题*!*/
        /*input[type=radio]:checked + label{*/
        /*    font-size: 20px;*/
        /*    font-weight: bold;*/
        /*}*/

        /*!*选中input标签中被选中的 checkbox类型的input标签 以及对应的标题*!*/
        /*input[type=checkbox]:checked + label{*/
        /*    font-size: 20px;*/
        /*    font-weight: bold;*/
        /*}*/


        /*!*E:focus 设置元素在其获取的鼠标焦点样式   通俗的讲就是 鼠标点到哪里就哪里变样式   *!*/
        /*input:focus{*/
        /*    background-color: tomato;*/
        /*    color: #fff;*/
        /*}*/

        /*::selection 匹配用户当前选中的元素       通俗的来讲，就是鼠标选中的文本内容变样式    */
        div::selection{
            background-color: tomato;
            color: white;
        }



    </style>



</head>
<body>
<form action="" method="get">
    <input type="text" name="user" value="admin5" />
    <br>
    <input type="text" name="user" value="admin4" />
    <br>
    <input type="text" name="user" value="admin3" />
    <br>
    <input type="text" name="user" value="admin2" />
    <br>
    <input type="text" readonly name="user1" value="admin1" />
    <br>
    <input type="text" disabled name="user2" value="admin2" />
    <hr>
    <input type="radio" name="sex" value="0" id="nv"><label for="nv">女</label>
    <input type="radio" name="sex" value="1" id="nan"><label for="nan">男</label>
    <input type="radio" name="sex" value="2" id="baomi"><label for="baomi">保密</label>
    <hr>
    <input type="checkbox" name="hobby[]" value="0" id="one"><label for="one">混球</label>
    <input type="checkbox" name="hobby[]" value="1" id="two"><label for="two">足球</label>
    <input type="checkbox" name="hobby[]" value="2" id="three"><label for="three">篮球</label>
</form>
<div>
    我是div中的内容
</div>
</body>
</html>